@CHARSET "UTF-8";
html {
background:url('burningShip.PNG') no-repeat center center fixed;
background-size: cover;
-webkit-user-select: none;
-moz-user-select:none;
}
@font-face {
	font-family: knowYourProduct;
	src: url("knowyour.ttf");
}
body {
font-size:100%;


}
div#pais {
text-align:center;
margin-top:3em;
margin-right:3em;
margin-left:3em;
}
div#tbl {
height: 35em;
}
div#jalus {
height: 1.5em;
width: 30em;
margin: 1em;
display: block;
margin-left: auto;
margin-right: auto;
}

h1{
font-size:4em;
font-family: knowYourProduct,serif;
text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;


}
img#FJ {
width: 10em;
height: 5em;
border: 0.1em solid #FF0000;
float: left;
}
img#FU {
width: 10em;
height: 5em;
border: 0.1em solid #0000FF ;
float: right;
}
div#flags {
width: 35.25em;
height: 5.5em;
margin-left: auto;
margin-right: auto;
display:block;
}
div#gridsAndShips{
width:70em;
margin-left:auto;
margin-right:auto;
margin-top:1em;
margin-bottom:1em;
height:27.5em;
}

div.gridDiv{
border:0.15em solid black;
display:table;
height:inherit;
width:inherit;
position:relative;
}
div#lGrid{
}

div.gridDivWrapper{
display:inline-block;;
height:inherit;
width:27.5em;
}

div#rGridWrapper{
float:right;
}

button.btn{
 font-family:knowYourProduct,serif;
}

div.btnsDiv{
display:inline;
margin-right:2em;
height:100%;
}
div#ships{
display:inline-block;
width: 11.5em;
height: 18.5em;
margin-left:1.60em;
margin-right:1em;
margin-top:5em;
vertical-align:top;
}

div.shipDiv{
height:4em;
width:inherit;
text-align:center;
}
img.fourDep{
height:2em;
width:11.5em;
}
div.threeDepWrap{
width:8.625em;
height:1.5em;
margin-right:auto;
margin-left:auto;
}
img.threeDep{
width:8.625em;
}
div.twoDepWrap{
display:inline-block;
width:5.175em;
height:0.95em;
}
img.twoDep{
width:5.175em;
}
div.oneDepWrap{
display:inline-block;
width:2.875em;
height:0.5em;

}
img.oneDep{
width:2.875em;
}
div.row{
width:inherit;
height:2.25em;
display:table-row;


}
div.square{
display:table-cell;
height:1.75em;
width:1.75em;
border:0.15em solid black;
background:#CCCCCC;
}
div.rsquare{
display:table-cell;
height:1.75em;
width:1.75em;
border:0.15em solid black;
background:#CCCCCC;
}
.square1{
	display:table-cell;
	height:1.75em;
	width:1.75em;
	border:0.15em solid black;
	background:#CCCCCC;
}